.cesium-widget-cesiumNavigationContainer {
  position: absolute;
  right: 0;
  bottom: 30px;
  width: 140px;
  display: flex;
  flex-direction: column-reverse;
  .compass {
    position: relative;
    top: auto;
    margin: 0 auto;
  }
  .navigation-controls {
    position: static;
    margin: 0 auto 8px;
    background: rgba(0, 0, 0, .3);
  }
  .distance-legend {
    position: relative;
    bottom: auto;
    margin: 0 auto;
    background: rgba(0, 0, 0, .3);
  }
}
@media screen and (max-width: 700px), screen and (max-height: 420px) {
  .distance-legend,.compass,.navigation-controls {
    display: block;
  }
}
